HTTP এবং API Integration

Mobile App Development - ফ্লাটার (Flutter)
326

Flutter এ HTTP এবং API Integration হলো একটি অত্যন্ত গুরুত্বপূর্ণ বিষয়, যা আপনাকে অ্যাপ্লিকেশনের বাইরে থেকে ডেটা আনতে এবং সার্ভারে ডেটা পাঠাতে সহায়তা করে। সাধারণত, অ্যাপ্লিকেশনগুলিতে RESTful API কল করা হয় JSON ডেটা আনার জন্য এবং সেই ডেটা UI তে প্রদর্শন করা হয়। Flutter এ API Integration করতে সবচেয়ে জনপ্রিয় প্যাকেজ হলো http প্যাকেজ। নিচে HTTP এবং API Integration এর বিস্তারিত আলোচনা করা হলো।

HTTP প্যাকেজ সেটআপ করা:

Flutter এ API কল করার জন্য প্রথমে http প্যাকেজ ইনস্টল করতে হবে। আপনার pubspec.yaml এ নিচের মত করে http প্যাকেজ যোগ করুন:

dependencies:
  http: ^0.13.4

ইনস্টলেশনের পর, আপনার ডার্ট ফাইলে import করুন:

import 'package:http/http.dart' as http;

GET রিকোয়েস্ট:

GET রিকোয়েস্ট ব্যবহার করে আপনি একটি API থেকে ডেটা (সাধারণত JSON ফরম্যাটে) আনতে পারেন। নিচে একটি উদাহরণ দেয়া হলো যেখানে একটি API থেকে ডেটা আনা হচ্ছে এবং তা UI তে প্রদর্শিত হচ্ছে।

GET রিকোয়েস্টের উদাহরণ:

import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(title: Text('API Integration Example')),
        body: Center(child: DataFetcher()),
      ),
    );
  }
}

class DataFetcher extends StatefulWidget {
  @override
  _DataFetcherState createState() => _DataFetcherState();
}

class _DataFetcherState extends State<DataFetcher> {
  String data = '';

  Future<void> fetchData() async {
    final response = await http.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1'));

    if (response.statusCode == 200) {
      // If the server returns an OK response, parse the JSON.
      final Map<String, dynamic> jsonData = json.decode(response.body);
      setState(() {
        data = jsonData['title'];
      });
    } else {
      // If the server did not return a 200 OK response, throw an error.
      setState(() {
        data = 'Failed to load data';
      });
    }
  }

  @override
  void initState() {
    super.initState();
    fetchData();
  }

  @override
  Widget build(BuildContext context) {
    return Text(data);
  }
}
  • http.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1')): একটি GET রিকোয়েস্ট, যা https://jsonplaceholder.typicode.com/posts/1 থেকে ডেটা আনে।
  • json.decode(response.body): JSON ডেটা ডিকোড করে ডার্ট অবজেক্টে রূপান্তরিত করে।
  • setState(() {...}): ডেটা প্রাপ্তির পর UI আপডেট করে।

POST রিকোয়েস্ট:

POST রিকোয়েস্ট ব্যবহার করে আপনি সার্ভারে ডেটা পাঠাতে পারেন। সাধারণত, ফর্ম ডেটা বা নতুন রিসোর্স তৈরি করার জন্য POST রিকোয়েস্ট ব্যবহার করা হয়।

POST রিকোয়েস্টের উদাহরণ:

Future<void> postData() async {
  final response = await http.post(
    Uri.parse('https://jsonplaceholder.typicode.com/posts'),
    headers: <String, String>{
      'Content-Type': 'application/json; charset=UTF-8',
    },
    body: json.encode(<String, String>{
      'title': 'My New Post',
      'body': 'This is the body of the post.',
      'userId': '1',
    }),
  );

  if (response.statusCode == 201) {
    // Success, parse response if needed
    print('Post created: ${response.body}');
  } else {
    // Error
    print('Failed to create post');
  }
}
  • http.post(): একটি POST রিকোয়েস্ট পাঠায়।
  • headers: API এর সাথে কনফিগারেশন অনুযায়ী হেডার পাঠানো হয়। সাধারণত Content-Type সেট করা হয়।
  • body: JSON ডেটা encode করে API এর মাধ্যমে পাঠানো হয়।

PUT এবং DELETE রিকোয়েস্ট:

  • PUT: বিদ্যমান ডেটা আপডেট করার জন্য PUT রিকোয়েস্ট ব্যবহার করা হয়।
  • DELETE: একটি রিসোর্স মুছে ফেলতে DELETE রিকোয়েস্ট ব্যবহার করা হয়।

PUT রিকোয়েস্টের উদাহরণ:

Future<void> updateData() async {
  final response = await http.put(
    Uri.parse('https://jsonplaceholder.typicode.com/posts/1'),
    headers: <String, String>{
      'Content-Type': 'application/json; charset=UTF-8',
    },
    body: json.encode(<String, String>{
      'title': 'Updated Title',
      'body': 'This is the updated body of the post.',
    }),
  );

  if (response.statusCode == 200) {
    print('Post updated: ${response.body}');
  } else {
    print('Failed to update post');
  }
}

DELETE রিকোয়েস্টের উদাহরণ:

Future<void> deleteData() async {
  final response = await http.delete(
    Uri.parse('https://jsonplaceholder.typicode.com/posts/1'),
  );

  if (response.statusCode == 200) {
    print('Post deleted');
  } else {
    print('Failed to delete post');
  }
}

Error Handling:

API কল করার সময় বিভিন্ন ধরনের ত্রুটি (error) হতে পারে, যেমন নেটওয়ার্ক সংযোগ সমস্যা, সার্ভারের ত্রুটি, বা অননুমোদিত অ্যাক্সেস। তাই, API কল করার সময় এগুলো ম্যানেজ করা প্রয়োজন।

Error Handling উদাহরণ:

Future<void> fetchDataWithErrorHandling() async {
  try {
    final response = await http.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1'));

    if (response.statusCode == 200) {
      print('Data fetched successfully: ${response.body}');
    } else {
      print('Error: ${response.statusCode}');
    }
  } catch (e) {
    print('An error occurred: $e');
  }
}
  • try-catch ব্লক: এটি অ্যাসিঙ্ক্রোনাস অপারেশন চলাকালে কোনো ত্রুটি ধরা পড়লে তাকে ম্যানেজ করে।
  • response.statusCode: HTTP স্ট্যাটাস কোড চেক করে, যা রিকোয়েস্টের সফলতা বা ব্যর্থতা নির্দেশ করে।

Flutter এ API Integration এর সেরা চর্চা:

  1. async এবং await ব্যবহার করুন: HTTP কল অ্যাসিঙ্ক্রোনাস হওয়ায় async এবং await ব্যবহার করে সহজে ম্যানেজ করা যায়।
  2. Error Handling: প্রতিটি API কল করার সময় ত্রুটি ম্যানেজমেন্ট করার জন্য try-catch ব্যবহার করা উচিৎ।
  3. Model এবং Serialization: API থেকে ডেটা পাওয়ার পর সেটিকে Dart Model অবজেক্টে রূপান্তরিত করা ভালো। এটি ডেটা ব্যবস্থাপনায় সাহায্য করে।

JSON ডেটা থেকে Model তৈরি করা:

API থেকে ডেটা পাওয়ার পর সেটিকে JSON থেকে Dart Model এ রূপান্তরিত করা যায়।

class Post {
  final int id;
  final String title;
  final String body;

  Post({required this.id, required this.title, required this.body});

  factory Post.fromJson(Map<String, dynamic> json) {
    return Post(
      id: json['id'],
      title: json['title'],
      body: json['body'],
    );
  }
}

Future<Post> fetchPost() async {
  final response = await http.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1'));

  if (response.statusCode == 200) {
    return Post.fromJson(json.decode(response.body));
  } else {
    throw Exception('Failed to load post');
  }
}

API Integration এর সুবিধা:

  • ডায়নামিক ডেটা: API এর মাধ্যমে সার্ভার থেকে ডায়নামিক ডেটা ফেচ করে UI আপডেট করা যায়।
  • ব্যবহারকারীর সাথে ইন্টারঅ্যাকশন: API কল ব্যবহার করে ব্যবহারকারীর ইনপুট সংগ্রহ করে তা সার্ভারে পাঠানো যায় এবং রেসপন্স অনুযায়ী UI আপডেট করা যায়।
  • বহু-পৃষ্ঠার অ্যাপ: একটি অ্যাপ্লিকেশনকে বহুমুখী এবং জটিল করতে API Integration অপরিহার্য।

Flutter এ HTTP এবং API Integration এর মাধ্যমে একটি শক্তিশালী এবং ডায়নামিক অ্যাপ্লিকেশন তৈরি করা যায়, যা ব্যবহারকারীর ইন্টারঅ্যাকশনের উপর ভিত্তি করে ডেটা প্রক্রিয়া করে এবং UI আপডেট করে।

Content added By

Flutter অ্যাপে HTTP API কল করা

410

Flutter-এ HTTP API কল করা একটি সাধারণ কাজ, যা ডেটা ফেচ করতে, ডাটাবেস বা সার্ভারের সাথে যোগাযোগ করতে, এবং অ্যাপ্লিকেশনের বিভিন্ন ডেটা ম্যানেজ করতে ব্যবহৃত হয়। Flutter-এ http প্যাকেজ ব্যবহার করে সহজেই API কল করা যায়। এখানে Flutter-এ HTTP API কল করার বিস্তারিত ধাপ এবং উদাহরণ দেওয়া হলো:

ধাপ ১: http প্যাকেজ ইন্সটল করা

প্রথমে pubspec.yaml ফাইলে http প্যাকেজ যোগ করুন:

dependencies:
  flutter:
    sdk: flutter
  http: ^0.13.5

এরপর flutter pub get চালিয়ে প্যাকেজ ইন্সটল করুন।

ধাপ ২: HTTP API কল করার উদাহরণ

Flutter-এ http প্যাকেজ ব্যবহার করে GET এবং POST রিকোয়েস্ট পাঠানোর উদাহরণ নিচে দেওয়া হলো:

উদাহরণ: GET রিকোয়েস্ট

GET রিকোয়েস্ট ব্যবহার করে আপনি কোনো API থেকে ডেটা ফেচ করতে পারেন, যেমন JSON ডেটা।

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  String? _data;

  Future<void> fetchData() async {
    final response = await http.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1'));

    if (response.statusCode == 200) {
      // সার্ভার থেকে ডেটা পাওয়া গেছে, JSON ডেটা ডিকোড করা হচ্ছে
      final Map<String, dynamic> jsonData = json.decode(response.body);
      setState(() {
        _data = jsonData['title']; // ডেটা সেভ করা
      });
    } else {
      // সার্ভার থেকে ডেটা না পাওয়া গেলে এরর দেখানো
      throw Exception('Failed to load data');
    }
  }

  @override
  void initState() {
    super.initState();
    fetchData();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('HTTP API Call Example'),
      ),
      body: Center(
        child: _data == null
            ? CircularProgressIndicator()
            : Text(_data!),
      ),
    );
  }
}

কোডের ব্যাখ্যা

  1. http.get: একটি GET রিকোয়েস্ট পাঠানো হয়েছে এবং এর রেসপন্স চেক করা হয়েছে। Uri.parse ব্যবহার করে API এর URL পাস করা হয়েছে।
  2. json.decode: JSON ডেটাকে ডিকোড করে Dart এর Map এ কনভার্ট করা হয়েছে।
  3. setState: ডেটা সফলভাবে পাওয়ার পর UI আপডেট করতে setState ব্যবহার করা হয়েছে।
  4. CircularProgressIndicator: যখন ডেটা লোড হচ্ছে, তখন লোডিং স্পিনার দেখানো হচ্ছে, এবং ডেটা লোড হয়ে গেলে Text উইজেট দিয়ে ডেটা দেখানো হচ্ছে।

উদাহরণ: POST রিকোয়েস্ট

POST রিকোয়েস্ট ব্যবহার করে আপনি সার্ভারে ডেটা পাঠাতে পারেন। Flutter-এ POST রিকোয়েস্ট করার জন্য নিচের কোড দেখুন:

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: PostDataScreen(),
    );
  }
}

class PostDataScreen extends StatefulWidget {
  @override
  _PostDataScreenState createState() => _PostDataScreenState();
}

class _PostDataScreenState extends State<PostDataScreen> {
  Future<void> postData() async {
    final url = Uri.parse('https://jsonplaceholder.typicode.com/posts');
    final response = await http.post(
      url,
      headers: <String, String>{
        'Content-Type': 'application/json; charset=UTF-8',
      },
      body: jsonEncode(<String, String>{
        'title': 'Flutter POST Request',
        'body': 'This is a test post request.',
        'userId': '1',
      }),
    );

    if (response.statusCode == 201) {
      // ডেটা সফলভাবে পোস্ট করা হয়েছে
      final jsonData = json.decode(response.body);
      print('Response: $jsonData');
    } else {
      // ডেটা পোস্ট করতে সমস্যা হলে
      throw Exception('Failed to post data');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('POST Request Example'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: postData,
          child: Text('Send POST Request'),
        ),
      ),
    );
  }
}

কোডের ব্যাখ্যা

  1. http.post: একটি POST রিকোয়েস্ট পাঠানো হয়েছে, যেখানে headers এবং body পাস করা হয়েছে।
  2. jsonEncode: Map কে JSON ফর্ম্যাটে রূপান্তর করা হয়েছে, যা POST রিকোয়েস্টের body হিসেবে পাঠানো হয়েছে।
  3. headers: Content-Type সেট করা হয়েছে application/json হিসেবে, যাতে সার্ভার বুঝতে পারে যে ডেটা JSON ফর্ম্যাটে পাঠানো হয়েছে।
  4. ElevatedButton: একটি বাটন তৈরি করা হয়েছে যা ক্লিক করলে POST রিকোয়েস্ট পাঠানো হয়।

HTTP API কল করার সময় কিছু টিপস:

Error Handling: API কল করার সময় সবসময় try-catch বা statusCode চেক করে এরর হ্যান্ডল করুন। উদাহরণ: যদি statusCode 200 না হয়, তাহলে একটি এক্সসেপশন থ্রো করতে পারেন।

Asynchronous Handling: async এবং await ব্যবহার করে API কলগুলি অ্যাসিনক্রোনাসভাবে পরিচালনা করুন, যাতে অ্যাপ্লিকেশন ব্লক না হয়।

Loading Indicator: API থেকে ডেটা লোড হওয়ার সময় ব্যবহারকারীদের জন্য CircularProgressIndicator বা অন্য কোনো লোডিং স্পিনার দেখান।

Response Format: নিশ্চিত করুন যে আপনি API থেকে আসা রেসপন্সের ফরম্যাট সঠিকভাবে ডিকোড করছেন। JSON ডেটা ডিকোড করতে json.decode ব্যবহার করুন।

Headers: API কল করার সময় প্রয়োজন অনুযায়ী headers ব্যবহার করুন, যেমন Authorization টোকেন বা কন্টেন্ট টাইপ।

অন্যান্য জনপ্রিয় HTTP প্যাকেজ এবং টুলস

Flutter-এ http প্যাকেজ ছাড়াও আরও কিছু প্যাকেজ ব্যবহার করা যায়:

  1. Dio:
    • এটি আরও ফ্লেক্সিবল এবং অ্যাডভান্সড ফিচার যেমন Interceptors, Global Configuration, এবং Multipart Upload প্রদান করে।
  2. Chopper:
    • এটি Retrofit-স্টাইল API কল করার একটি প্যাকেজ, যা API ইন্টারফেসগুলোকে সংগঠিত এবং কোডকে আরও পরিষ্কার করে।

সারাংশ

  • Flutter-এ HTTP API কল করা সহজ এবং http প্যাকেজ ব্যবহার করে এটি খুব দ্রুত করা যায়।
  • GET এবং POST রিকোয়েস্ট ব্যবহার করে সার্ভার থেকে ডেটা ফেচ করা এবং সার্ভারে ডেটা পাঠানো সম্ভব।
  • সঠিকভাবে Error Handling, Async Handling, এবং Response Management নিশ্চিত করে একটি কার্যকরী HTTP API কল সিস্টেম তৈরি করা যায়।
Content added By

JSON ডেটা Parse এবং Display করা

230

Flutter এ JSON ডেটা Parse এবং Display করা খুবই সাধারণ কাজ, বিশেষ করে যখন আপনি API থেকে ডেটা ফেচ করে UI তে প্রদর্শন করতে চান। নিচে JSON ডেটা Parse এবং Display করার ধাপগুলো ব্যাখ্যা করা হলো।

JSON ডেটা Parse করার ধাপ:

ধাপ ১: API থেকে JSON ডেটা ফেচ করা:

  • Flutter এ HTTP রিকোয়েস্ট পাঠানোর জন্য http প্যাকেজ ব্যবহার করা হয়।
  • pubspec.yaml ফাইলে http প্যাকেজ যোগ করুন:
dependencies:
  http: ^0.13.0

ধাপ ২: মডেল ক্লাস তৈরি করা:

  • JSON ডেটাকে ডার্ট অবজেক্টে রূপান্তর করার জন্য একটি মডেল ক্লাস তৈরি করা হয়, যা JSON ডেটার কাঠামো অনুযায়ী গঠন করা হয়।

ধাপ ৩: JSON ডেটা ফেচ, Parse এবং Display করা:

  • নিচে একটি সম্পূর্ণ উদাহরণ দেওয়া হলো যেখানে JSON ডেটা ফেচ, Parse, এবং Display করা হয়েছে।

Flutter এ JSON ডেটা Parse এবং Display করার উদাহরণ:

import 'package:flutter/material.dart';
import 'dart:convert';
import 'package:http/http.dart' as http;

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter JSON Parsing Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('JSON Parsing Example'),
        ),
        body: UserList(),
      ),
    );
  }
}

// মডেল ক্লাস
class User {
  final int id;
  final String name;
  final String email;

  User({required this.id, required this.name, required this.email});

  // JSON ডেটা থেকে User অবজেক্টে রূপান্তর
  factory User.fromJson(Map<String, dynamic> json) {
    return User(
      id: json['id'],
      name: json['name'],
      email: json['email'],
    );
  }
}

// ডেটা ফেচ এবং Display করার Widget
class UserList extends StatefulWidget {
  @override
  _UserListState createState() => _UserListState();
}

class _UserListState extends State<UserList> {
  late Future<List<User>> users;

  @override
  void initState() {
    super.initState();
    users = fetchUsers();
  }

  // JSON ডেটা ফেচ এবং Parse করা
  Future<List<User>> fetchUsers() async {
    final response =
        await http.get(Uri.parse('https://jsonplaceholder.typicode.com/users'));

    if (response.statusCode == 200) {
      // JSON ডেটা Parse করে List<User> তে রূপান্তর করা
      List<dynamic> jsonData = json.decode(response.body);
      return jsonData.map((user) => User.fromJson(user)).toList();
    } else {
      throw Exception('Failed to load users');
    }
  }

  @override
  Widget build(BuildContext context) {
    return FutureBuilder<List<User>>(
      future: users,
      builder: (context, snapshot) {
        if (snapshot.connectionState == ConnectionState.waiting) {
          return Center(child: CircularProgressIndicator());
        } else if (snapshot.hasError) {
          return Center(child: Text('Error: ${snapshot.error}'));
        } else if (snapshot.hasData) {
          return ListView.builder(
            itemCount: snapshot.data!.length,
            itemBuilder: (context, index) {
              return ListTile(
                title: Text(snapshot.data![index].name),
                subtitle: Text(snapshot.data![index].email),
              );
            },
          );
        } else {
          return Center(child: Text('No users found'));
        }
      },
    );
  }
}

ধাপে ধাপে বিশ্লেষণ:

ধাপ ১: API থেকে JSON ডেটা ফেচ করা:

  • fetchUsers মেথডে http.get ব্যবহার করে API থেকে JSON ডেটা ফেচ করা হয়। এখানে https://jsonplaceholder.typicode.com/users একটি উদাহরণ API ব্যবহার করা হয়েছে, যা ইউজারের JSON ডেটা প্রদান করে।
  • যদি রিকোয়েস্ট সফল হয় (স্ট্যাটাস কোড ২০০ হয়), তাহলে JSON ডেটা json.decode দিয়ে Decode করে Dart এর List তে রূপান্তর করা হয়।

ধাপ ২: JSON ডেটা থেকে মডেল অবজেক্ট তৈরি করা:

  • User ক্লাসে fromJson মেথড তৈরি করা হয়েছে, যা JSON ডেটা থেকে একটি User অবজেক্ট তৈরি করে।
  • jsonData.map((user) => User.fromJson(user)).toList(); লাইনটি JSON ডেটার লিস্ট থেকে User অবজেক্টের লিস্ট তৈরি করে।

ধাপ ৩: JSON ডেটা Display করা:

  • FutureBuilder ব্যবহার করে ফেচ করা ডেটা UI তে প্রদর্শন করা হয়েছে।
  • snapshot থেকে ডেটা লোডিং স্টেট এবং ডেটার অবস্থা চেক করা হয়েছে:
    • Loading State: CircularProgressIndicator দেখানো হয় যখন ডেটা লোড হচ্ছে।
    • Error State: যদি কোনো ত্রুটি থাকে, তাহলে একটি ত্রুটি বার্তা দেখানো হয়।
    • Data State: ডেটা সফলভাবে লোড হলে ListView.builder ব্যবহার করে প্রতিটি ইউজার ডেটা প্রদর্শন করা হয়।

সংক্ষেপে:

  • API থেকে JSON ফেচ করা: http.get ব্যবহার করে JSON ডেটা ফেচ করা হয়।
  • মডেল ক্লাস তৈরি করা: JSON ডেটা থেকে Dart অবজেক্টে রূপান্তর করার জন্য একটি মডেল ক্লাস তৈরি করা হয়।
  • FutureBuilder ব্যবহার করে UI তে ডেটা প্রদর্শন: FutureBuilder ব্যবহার করে ডেটা লোডিং, ত্রুটি, এবং সফল ডেটা লোডিং হ্যান্ডেল করা হয়।

এই পদ্ধতি ব্যবহার করে Flutter এ সহজেই JSON ডেটা Parse করে UI তে প্রদর্শন করা যায়।

Content added By

HTTP Requests (GET, POST, PUT, DELETE)

373

Flutter এ HTTP Requests (GET, POST, PUT, DELETE) ব্যবহার করে API কল করা যায়, যার মাধ্যমে আপনি অ্যাপ্লিকেশনের সাথে সার্ভারের ডেটা আদানপ্রদান করতে পারেন। http প্যাকেজ Flutter এ HTTP রিকোয়েস্ট ব্যবস্থাপনা করার জন্য সবচেয়ে জনপ্রিয় এবং সহজ প্যাকেজ। নিচে প্রতিটি HTTP রিকোয়েস্ট (GET, POST, PUT, DELETE) এর বিস্তারিত আলোচনা এবং উদাহরণ দেয়া হলো।

HTTP প্যাকেজ সেটআপ করা:

Flutter এ HTTP রিকোয়েস্ট ব্যবহারের জন্য প্রথমে http প্যাকেজ ইনস্টল করতে হবে। আপনার pubspec.yaml এ নিচের মত করে http প্যাকেজ যোগ করুন:

dependencies:
  http: ^0.13.4

তারপর আপনার ডার্ট ফাইলে import করুন:

import 'package:http/http.dart' as http;
import 'dart:convert';

১. GET Request:

GET রিকোয়েস্ট ব্যবহার করে API থেকে ডেটা আনা যায়। এটি সাধারণত ডেটা ফেচ করার জন্য ব্যবহৃত হয়।

GET Request এর উদাহরণ:

Future<void> fetchData() async {
  final response = await http.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1'));

  if (response.statusCode == 200) {
    final Map<String, dynamic> jsonData = json.decode(response.body);
    print('Title: ${jsonData['title']}');
  } else {
    print('Failed to load data');
  }
}
  • http.get: এটি একটি GET রিকোয়েস্ট যা নির্দিষ্ট URL থেকে ডেটা আনে।
  • response.statusCode: রিকোয়েস্টের সফলতা বা ব্যর্থতা যাচাই করার জন্য ব্যবহার করা হয়। 200 মানে সফল, অন্যথায় ব্যর্থ।
  • json.decode(response.body): JSON ডেটাকে Dart Map এ রূপান্তরিত করা হয়।

২. POST Request:

POST রিকোয়েস্ট সাধারণত নতুন ডেটা ক্রিয়েট বা সার্ভারে পাঠানোর জন্য ব্যবহৃত হয়, যেমন ফর্ম ডেটা বা নতুন রিসোর্স তৈরি করা।

POST Request এর উদাহরণ:

Future<void> createPost() async {
  final response = await http.post(
    Uri.parse('https://jsonplaceholder.typicode.com/posts'),
    headers: <String, String>{
      'Content-Type': 'application/json; charset=UTF-8',
    },
    body: json.encode(<String, String>{
      'title': 'New Post',
      'body': 'This is the body of the new post.',
      'userId': '1',
    }),
  );

  if (response.statusCode == 201) {
    print('Post created: ${response.body}');
  } else {
    print('Failed to create post');
  }
}
  • http.post: এটি একটি POST রিকোয়েস্ট যা সার্ভারে ডেটা পাঠায়।
  • headers: API এর কনফিগারেশন অনুযায়ী হেডার সেট করা হয়। সাধারণত Content-Type হিসেবে application/json নির্ধারণ করা হয়।
  • body: JSON ডেটা encode করে API তে পাঠানো হয়।

৩. PUT Request:

PUT রিকোয়েস্ট ব্যবহার করে বিদ্যমান রিসোর্স আপডেট করা হয়। এটি সাধারণত সম্পূর্ণ রিসোর্স আপডেটের জন্য ব্যবহৃত হয়।

PUT Request এর উদাহরণ:

Future<void> updatePost() async {
  final response = await http.put(
    Uri.parse('https://jsonplaceholder.typicode.com/posts/1'),
    headers: <String, String>{
      'Content-Type': 'application/json; charset=UTF-8',
    },
    body: json.encode(<String, String>{
      'title': 'Updated Title',
      'body': 'This is the updated body of the post.',
      'userId': '1',
    }),
  );

  if (response.statusCode == 200) {
    print('Post updated: ${response.body}');
  } else {
    print('Failed to update post');
  }
}
  • http.put: এটি একটি PUT রিকোয়েস্ট যা বিদ্যমান রিসোর্স আপডেট করতে ব্যবহৃত হয়।
  • response.statusCode: ২০০ হলে সফল, অন্যথায় ব্যর্থতা নির্দেশ করে।

৪. DELETE Request:

DELETE রিকোয়েস্ট ব্যবহার করে সার্ভার থেকে একটি রিসোর্স মুছে ফেলা যায়।

DELETE Request এর উদাহরণ:

Future<void> deletePost() async {
  final response = await http.delete(
    Uri.parse('https://jsonplaceholder.typicode.com/posts/1'),
  );

  if (response.statusCode == 200) {
    print('Post deleted');
  } else {
    print('Failed to delete post');
  }
}
  • http.delete: এটি একটি DELETE রিকোয়েস্ট, যা নির্দিষ্ট রিসোর্স মুছে ফেলে।
  • response.statusCode: ২০০ হলে সফলতা নির্দেশ করে।

HTTP Requests এর সংক্ষিপ্ত তুলনা:

রিকোয়েস্টব্যবহারিক উদ্দেশ্য
GETডেটা ফেচ করা বা সার্ভার থেকে রিসোর্স আনা
POSTনতুন ডেটা ক্রিয়েট করা বা সার্ভারে ডেটা পাঠানো
PUTবিদ্যমান ডেটা সম্পূর্ণভাবে আপডেট করা
DELETEএকটি রিসোর্স বা ডেটা মুছে ফেলা

Error Handling (ত্রুটি ম্যানেজমেন্ট):

HTTP রিকোয়েস্টের সময় বিভিন্ন ধরনের ত্রুটি হতে পারে। তাই, ত্রুটি ম্যানেজমেন্ট করার জন্য try-catch ব্লক ব্যবহার করা হয়।

Future<void> fetchDataWithErrorHandling() async {
  try {
    final response = await http.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1'));

    if (response.statusCode == 200) {
      print('Data fetched successfully: ${response.body}');
    } else {
      print('Error: ${response.statusCode}');
    }
  } catch (e) {
    print('An error occurred: $e');
  }
}
  • try-catch: এটি অ্যাসিঙ্ক্রোনাস অপারেশন চলাকালে কোনো ত্রুটি ধরলে তাকে ম্যানেজ করে।
  • response.statusCode: HTTP স্ট্যাটাস কোড চেক করে, যা সফলতা বা ব্যর্থতা নির্দেশ করে।

HTTP Requests এর সেরা চর্চা:

  1. Headers ব্যবহার করুন: API এর সাথে কনফিগারেশন অনুযায়ী সঠিক হেডার ব্যবহার করা গুরুত্বপূর্ণ, যেমন Content-Type নির্ধারণ।
  2. Error Handling: প্রতিটি API কলের সময় ত্রুটি ম্যানেজ করার জন্য try-catch ব্যবহার করা উচিত।
  3. Model এবং Serialization: JSON ডেটাকে Dart Model এ রূপান্তরিত করা ভালো, যাতে ডেটা ব্যবস্থাপনা সহজ হয়।
  4. async এবং await ব্যবহার করুন: HTTP কল অ্যাসিঙ্ক্রোনাস হওয়ায় async এবং await ব্যবহার করা সেরা পদ্ধতি।

Flutter এ HTTP Requests ব্যবহার করে ডেটা ম্যানেজমেন্ট:

HTTP Requests (GET, POST, PUT, DELETE) ব্যবহারের মাধ্যমে Flutter এ আপনি ডায়নামিক অ্যাপ্লিকেশন তৈরি করতে পারেন, যেখানে ব্যবহারকারীর ইন্টারঅ্যাকশনের উপর ভিত্তি করে ডেটা ফেচ, আপডেট, এবং মুছে ফেলার কাজ করা যায়। এই পদ্ধতিগুলো ব্যবহার করে Flutter এ একটি কার্যকরী এবং পেশাদার API Integration সিস্টেম তৈরি করা সম্ভব।

Content added By

RESTful API Integration এবং Authentication

248

Flutter-এ RESTful API Integration এবং Authentication অত্যন্ত গুরুত্বপূর্ণ, কারণ এটি অ্যাপ্লিকেশনকে সার্ভারের সাথে যোগাযোগ করতে এবং ব্যবহারকারীদের সুরক্ষিত অ্যাক্সেস প্রদান করতে সহায়ক করে। RESTful API Integration এর মাধ্যমে অ্যাপ্লিকেশন ডেটা ফেচ করতে পারে, ডেটা আপডেট করতে পারে, এবং ডাটাবেসের সাথে যোগাযোগ করতে পারে। Authentication ব্যবহার করে, ব্যবহারকারীর তথ্য সুরক্ষিত রাখা যায় এবং শুধুমাত্র অনুমোদিত ব্যবহারকারীদের জন্য অ্যাপ্লিকেশনের নির্দিষ্ট অংশ অ্যাক্সেস করা যায়।

১. RESTful API Integration

Flutter-এ RESTful API Integration করতে সাধারণত http বা Dio প্যাকেজ ব্যবহার করা হয়। এই প্যাকেজগুলোর মাধ্যমে আমরা GET, POST, PUT, DELETE ইত্যাদি HTTP রিকোয়েস্ট পাঠাতে পারি এবং ডেটা সংগ্রহ করতে পারি।

উদাহরণ: RESTful API Integration (GET এবং POST রিকোয়েস্ট)

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  String? _data;

  Future<void> fetchData() async {
    final response = await http.get(Uri.parse('https://jsonplaceholder.typicode.com/posts/1'));

    if (response.statusCode == 200) {
      final jsonData = json.decode(response.body);
      setState(() {
        _data = jsonData['title'];
      });
    } else {
      throw Exception('Failed to load data');
    }
  }

  Future<void> postData() async {
    final response = await http.post(
      Uri.parse('https://jsonplaceholder.typicode.com/posts'),
      headers: <String, String>{
        'Content-Type': 'application/json; charset=UTF-8',
      },
      body: jsonEncode(<String, String>{
        'title': 'Flutter POST Request',
        'body': 'This is a test post request.',
        'userId': '1',
      }),
    );

    if (response.statusCode == 201) {
      final jsonData = json.decode(response.body);
      print('Response: $jsonData');
    } else {
      throw Exception('Failed to post data');
    }
  }

  @override
  void initState() {
    super.initState();
    fetchData();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('RESTful API Integration'),
      ),
      body: Center(
        child: _data == null
            ? CircularProgressIndicator()
            : Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(_data!),
                  ElevatedButton(
                    onPressed: postData,
                    child: Text('Send POST Request'),
                  ),
                ],
              ),
      ),
    );
  }
}

২. Authentication (Token-based)

Flutter-এ Token-based Authentication (যেমন JWT বা Bearer Token) সাধারণত ব্যবহৃত হয়। এই প্রক্রিয়ায়, ব্যবহারকারী লগইন করলে সার্ভার থেকে একটি Token ফেরত আসে, যা পরবর্তী সকল API রিকোয়েস্টে ব্যবহার করে Authentication নিশ্চিত করা হয়।

ধাপ ১: Authentication API কল (লগইন)

Future<String?> login(String email, String password) async {
  final response = await http.post(
    Uri.parse('https://example.com/api/login'),
    headers: <String, String>{
      'Content-Type': 'application/json; charset=UTF-8',
    },
    body: jsonEncode(<String, String>{
      'email': email,
      'password': password,
    }),
  );

  if (response.statusCode == 200) {
    final jsonData = json.decode(response.body);
    String token = jsonData['token'];
    return token; // টোকেন ফেরত দেয়া হচ্ছে
  } else {
    throw Exception('Failed to login');
  }
}
  • http.post: এখানে লগইন রিকোয়েস্ট পাঠানো হয়েছে। সঠিক ইমেইল এবং পাসওয়ার্ড প্রদান করলে সার্ভার থেকে একটি token ফেরত আসে।
  • jsonEncode: ইউজার ইনপুটকে JSON ফরম্যাটে কনভার্ট করে পাঠানো হয়েছে।
  • headers: Content-Type কে application/json হিসেবে সেট করা হয়েছে, যাতে সার্ভার ডেটা সঠিকভাবে বুঝতে পারে।

ধাপ ২: সুরক্ষিত API কল (Token ব্যবহার করে)

লগইন করার পর টোকেন ব্যবহার করে সুরক্ষিত API কল করতে হয়। টোকেনটি API রিকোয়েস্টে Authorization হেডারে পাঠানো হয়।

Future<void> fetchProtectedData(String token) async {
  final response = await http.get(
    Uri.parse('https://example.com/api/protected'),
    headers: <String, String>{
      'Content-Type': 'application/json; charset=UTF-8',
      'Authorization': 'Bearer $token', // টোকেন যুক্ত করা হয়েছে
    },
  );

  if (response.statusCode == 200) {
    final jsonData = json.decode(response.body);
    print('Protected Data: $jsonData');
  } else {
    throw Exception('Failed to fetch protected data');
  }
}
  • Authorization হেডারে Bearer টোকেন পাঠানো হয়েছে, যা সার্ভারকে নির্দেশ করে যে এই রিকোয়েস্টটি একটি সুরক্ষিত রিকোয়েস্ট এবং টোকেনটি যাচাই করতে হবে।

৩. টোকেন সংরক্ষণ এবং ব্যবহার

Flutter-এ টোকেন সংরক্ষণ করতে SharedPreferences বা Secure Storage ব্যবহার করা যায়। টোকেন সংরক্ষণ করলে ব্যবহারকারীকে বারবার লগইন করতে হয় না।

উদাহরণ: SharedPreferences ব্যবহার করে টোকেন সংরক্ষণ করা

import 'package:shared_preferences/shared_preferences.dart';

// টোকেন সংরক্ষণ করা
Future<void> saveToken(String token) async {
  final prefs = await SharedPreferences.getInstance();
  await prefs.setString('auth_token', token);
}

// টোকেন রিড করা
Future<String?> getToken() async {
  final prefs = await SharedPreferences.getInstance();
  return prefs.getString('auth_token');
}
  • saveToken: টোকেন SharedPreferences এ সেভ করে রাখা হয়েছে, যাতে এটি পরবর্তীতে সহজে অ্যাক্সেস করা যায়।
  • getToken: সংরক্ষিত টোকেন রিড করে অ্যাপ্লিকেশনে ব্যবহার করা হয়েছে।

৪. লগআউট ফাংশনালিটি

লগআউট করার সময় টোকেন রিমুভ করে এবং অ্যাপ্লিকেশনকে রিফ্রেশ করা হয়।

Future<void> logout() async {
  final prefs = await SharedPreferences.getInstance();
  await prefs.remove('auth_token'); // টোকেন রিমুভ করা
}

৫. সুরক্ষিত অ্যাপ্লিকেশন ব্যবহার নিশ্চিত করা

যখন অ্যাপ্লিকেশন চালু হয়, তখন নিশ্চিত করুন যে টোকেন পাওয়া যাচ্ছে কিনা। যদি টোকেন থাকে, তবে ব্যবহারকারীকে সরাসরি সুরক্ষিত স্ক্রিনে নিয়ে যান। অন্যথায়, লগইন স্ক্রিন দেখান।

void checkAuthentication(BuildContext context) async {
  String? token = await getToken();
  if (token != null) {
    // টোকেন পাওয়া গেছে, সুরক্ষিত স্ক্রিনে যান
    Navigator.pushReplacement(
      context,
      MaterialPageRoute(builder: (context) => ProtectedScreen()),
    );
  } else {
    // টোকেন পাওয়া যায়নি, লগইন স্ক্রিনে যান
    Navigator.pushReplacement(
      context,
      MaterialPageRoute(builder: (context) => LoginScreen()),
    );
  }
}

সারাংশ

  • RESTful API Integration: Flutter-এ http বা Dio প্যাকেজ ব্যবহার করে RESTful API এর মাধ্যমে ডেটা ফেচ করা এবং আপডেট করা যায়।
  • Authentication: Token-based authentication (যেমন JWT) ব্যবহার করে অ্যাপ্লিকেশনকে সুরক্ষিত করা যায়।
  • Token Storage: টোকেন সংরক্ষণ করতে SharedPreferences বা Secure Storage ব্যবহার করা হয়, যাতে ব্যবহারকারীর সেশন ম্যানেজ করা যায়।
  • Logout Functionality: লগআউট করলে টোকেন রিমুভ করে ব্যবহারকারীকে লগইন স্ক্রিনে পাঠানো হয়।

Flutter-এ RESTful API এবং Authentication ব্যবহারে এই পদ্ধতিগুলো ফলো করলে আপনি একটি সুরক্ষিত এবং কার্যকরী অ্যাপ্লিকেশন তৈরি করতে পারবেন।

Content added By
Promotion
NEW SATT AI এখন আপনাকে সাহায্য করতে পারে।

Are you sure to start over?

Loading...